<template>
    <div class="">
        <el-card class="box-card font-left">
            <div slot="header" class="clearfix">
                <span class="font-left">CMS管理员注册</span>
            </div>
            <el-form ref="form" :model="form" label-width="80px" :rules="rules">
                <el-form-item label="注册账号" prop="count">
                    <el-input v-model="form.count"></el-input>
                </el-form-item>
                <el-form-item label="注册密码" prop="password">
                    <el-input v-model="form.password" type="password"></el-input>
                </el-form-item>
                <el-form-item label="确认密码" prop="password2">
                    <el-input v-model="form.password2" type="password"></el-input>
                </el-form-item>
            </el-form>
            <div>
                <el-button @click="register(form)" class="login">注册</el-button>
                <el-button @click="goLogin" class="register">去登录</el-button>
            </div>
        </el-card>
    </div>
</template>
<script>
 import  formValidator  from '../util/validator.js'
  export default {
    data() {
      return {
        form: {
          count: '',
          password:'',
          password2:''
        },
        rules:{
            count:[
                {
                    required:true,
                    message:"请输入注册账号",
                    trigger: 'blur'
                },
            ],
            password:[
                {
                    required:true,
                    message:"请输入注册密码",
                    trigger: 'blur'
                }
            ],
            password2:[
                {
                    required:true,
                    message:"请再次输入注册密码",
                    trigger: 'blur'

                }
            ],           
        }
      }
    },
    methods: {
       register(form){
           formValidator.myValidate(this.rules,form).then((e)=>{
               if(e){
                   if(e.length>1){
                       this.$message.error("请填写带*选项")
                   }else
                        this.$message.error(e[0].message)     
                    return;             
               }
               if(form.password!=form.password2){
                   return this.$message.error("两次密码不一致")
               }

               this.$axios.post('/User/register',form).then((res)=>{
                    const result = res.data.d;
                    if(result.status==false){
                         return this.$message.error(result.message)
                    }
                    this.$message.success(result.message);
                    const date = new Date().toLocaleDateString();
                    sessionStorage.setItem("token",result.uid+date)                   
                    // sessionStorage.setItem('isLogin','')
                    this.$router.push("/index/")
               })
           })
           
       } ,
       goLogin(){
           this.$router.push("/")
       }
    }
  }
</script>
<style  scoped>
    .el-card{
        width:35%;
        margin:10% auto
    }
    .el-card__body{
        width:75%;
        margin:0 auto;
        
    }
    .font-left{
        text-align:left;
        font-weight:bold
    }
</style>

<style scoped>
    .font-left{
        text-align:left;
        font-weight:bold
    }
    .login{
        width: 35%;
        margin-left:22%
    }
    .register{
        width: 35%;
        margin-left:6%
    }

</style>